@import url(./common/global.less);
.iconfont {
  margin-right: 20px;
  font-size: 24px;
}
.icon-success{
 color:@success-color ;
}
.icon-error{
 color:@error-color ;
}
.icon-info{
 color: @info-color;
}
.icon-warning{
 color: @warning-color;
}
@keyframes show{
0% {transform: rotate(-5deg);}
10% {transform: rotate(5deg);}
20% {transform: rotate(-5deg);}
30% {transform: rotate(5deg);}
40% {transform: rotate(-3deg);}
50% {transform: rotate(3deg);}
60% {transform: rotate(-3deg);}
70% {transform: rotate(3deg);}
80% {transform: rotate(-1deg);}
90% {transform: rotate(1deg);}
100% {transform: rotate(0deg);}
}
h2{
   font-weight: 500; 
   font-size: 16px;
   color: #303133;
   margin: 0;
}
.fade-leave-active {
 transition: all .2s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.fade-enter, .fade-leave-to{
 transform: translateX(10px);
 opacity: 0;
}
.notification{
z-index: 9999999999;
background-color: #fff;
padding: 20px;
position: fixed;
width: 310px;
display: flex;
transition: all 0.3s;
box-shadow: -5px 5px 12px 0 rgba(204, 204, 204, .8);
border-radius: 10px;
border: 1px solid #ebeef5;
animation: show .6s;
&__top{
  display: flex;
  margin-bottom: 10px;
}
&__content{
 padding: 0;
 font-size: 14px;
 color: #515A6E;
}
&__btn{
 color: #9C9C9C;
 padding-left: 24px;
 margin-left: auto;
 cursor: pointer;
}
}